<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<!--
 .d8888b.                                    888      888b     d888          888888b.                     888      888     888          
d88P  Y88b                                   888      8888b   d8888          888  "88b                    888      888     888          
Y88b.                                        888      88888b.d88888          888  .88P                    888      888     888          
 "Y888b.    .d88b.   8888b.  888d888 .d8888b 88888b.  888Y88888P888 888  888 8888888K.   .d88b.   .d88b.  888  888 888     888 88888b.  
    "Y88b. d8P  Y8b     "88b 888P"  d88P"    888 "88b 888 Y888P 888 888  888 888  "Y88b d88""88b d88""88b 888 .88P 888     888 888 "88b 
      "888 88888888 .d888888 888    888      888  888 888  Y8P  888 888  888 888    888 888  888 888  888 888888K  888     888 888  888 
Y88b  d88P Y8b.     888  888 888    Y88b.    888  888 888   "   888 Y88b 888 888   d88P Y88..88P Y88..88P 888 "88b Y88b. .d88P 888 d88P 
 "Y8888P"   "Y8888  "Y888888 888     "Y8888P 888  888 888       888  "Y88888 8888888P"   "Y88P"   "Y88P"  888  888  "Y88888P"  88888P"  
                                                                         888                                                   888      
                                                                    Y8b d88P                                                   888      
                                                                     "Y88P"                                                    888      
 -->
<head>
    <title>Search My Book Up!</title>
    <link rel="stylesheet" type="text/css" href="css/css_SMBU.css" />
    <script type="text/javascript" language="javascript" src="./js/jquery-1.4.1.min.js"></script>
    <script language="javascript" type="text/javascript">
     /* function f_affiche(element) {
//        alert ($("#contenu").css("background-color"));
        if ($("#contenu").css("background-color") == ("rgb(255, 255, 255)")) {
          if (element == "search") {
            $("#contenu").css("background-color","rgb(93,168,180)");
            $("#contenu_search").css("display","block");
          }
          else {$("#contenu").css("background-color","rgb(147,166,102)")}
        }
        else ($("#contenu").css("background-color", "rgb(255, 255, 255)"));
      }*/
     
     function f_search(){
         $("#contenu_search_index").slideDown();
         $("#contenu_connexion_index").slideUp();
     }
          function f_login(){
         $("#contenu_search_index").slideUp();
        $("#contenu_connexion_index").slideDown();
     }
    </script>
</head>

<body>
  <div id="page_index">
      <div id="footer_index">
      <span> &copy; 2010 Fatiha Elmouktafi - Maria Gemayel - Cl&eacute;ment Larriv&eacute; - Lin Tong Xu || <a href="mailto:searchmybu [4R0B4S3] gmail [P01NT] com" style="color:white">contact</a></span>
    </div>
    <div id="head_index">
      <div id="logo_index">
      </div>
      <div id="texte">
           <p>SearchMyBookUp<br>
        est la plate-forme sociale d'&eacute;change d'information<br>
        et de savoir autour des ouvrages et travaux
        <br>de recherche de la biblioth&egrave;que universitaire</p>
        </div>
    </div>

    <div id="items_index">
      <div id="search_index">
        <a href="#" onclick="f_search();" style="color:white;float:left;padding-top:16px;display:block;width:100%;height:100%;">Rechercher un livre</a>
      </div>
      <div id="login_index">
        <a href="#" onclick="f_login();" style="color:white;float:left;padding-top:18px;display:block;width:100%;height:100%;">Se connecter ou s'inscrire</a>
      </div>
    </div>
    <div id="contenu_index">
                 <div id="contenu_search_index" style="display:none;">
                                <div id="trouver" class="rondbas" style="position:relative;right:308px;top:-125px;width:980px;">
                                    <table style="padding-left:228px;padding-top:24px;">
                                        <tr style="font-size:16px;color:white;">
                                        <td colspan="4" style="padding-top:5px;">Derniers ajouts</td>
                                        </tr>
                                        <tr>
                                            <td colspan="4">
                                                <img src="css/images/ajout_couverture1.png"/>
                                                <img src="css/images/ajout_couverture2.png"/>
                                                <img src="css/images/ajout_couverture3.png"/>
                                                <img src="css/images/ajout_couverture4.png"/>
                                                <img src="css/images/ajout_couverture5.png"/>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td colspan="4" class="deco">
                                                <img src="css/images/ajouter_deco.png"/>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td style="color:white;width:30px;">Titre</td>
                                            <td>
                                                <input type="text" size="20" style="height:21px;border:1px solid white;"/>
                                                </td>
                                            <td style="color:white;width:30px;">Auteur(s)</td>
                                            <td>
                                                <input type="text" size="15"style="height:21px;border:1px solid white;"/>
                                                </td>
                                        </tr>
                                        <tr>
                                            <td colspan="4" class="deco">
                                                <img src="css/images/ajouter_deco.png"/>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td style="color:white;width:30px;">I.S.B.N.</td>
                                            <td>
                                                <input type="text" size="20" style="height:21px;border:1px solid white;"/>
                                                </td>
                                            <td style="color:white;width:30px;">Tag(s)</td>
                                            <td>
                                                <input type="text" size="20" style="height:21px;border:1px solid white;"/>
                                                </td>
                                        </tr>
                                        <tr>
                                            <td colspan="4" class="deco">
                                                <img src="css/images/ajouter_deco.png"/>
                                            </td>
                                        </tr>
                                    </table>
                                        <div class="choisir" style="margin-left:420px;margin-right:0;text-align:center;">
                                            <form>
                                                <a href="index3.php"><label><input type="button" value="OK" style="color:#a00e49;width:43px;height:26px;margin-top:5px;"></label></a>
                                            </form>
                                        </div>
                                </div>
                 </div>
                 
                 
                 
                 
                 <div id="contenu_connexion_index" style="display:none;">
                     
                                <!--********************************************Connectet**************************************************************-->
                    <div style="background-color:#ddbc46;height:400px;position:relative;right:300px;top:-75px;width:980px;">
                        <div id="connecter" style="padding-left:106px;margin-top:25px;">
                                <h1 id="biblio" class="title" style="width:290px;">Se connecter</h1>
                                <div id="formulaire" class="bleu" style="background-color:transparent;">
                                    <table>
                                            <tr>
                                                <td style="color:white">Adresse de courriel :</td>
                                                <td>
                                                    <input type="text" size="20" style="height:21px;border:1px solid white;">
                        
                                                </td>
                                            </tr>
                                            <tr>
                                                <td style="color:white">Mot de passe :<br>
                                                <a href="#" style="font-size:9px;">Mot de passe oubli&eacute;</a></td>
                                                <td>
                                            <input type="password" size="20" style="height:21px;border:1px solid white;">
                                                </td>
                                            </tr>
                        
                                   </table>
                                   <form>
                                   <a href="index2.php"><input type="button" value="OK" style="color:#a00e49;width:43px;height:26px;margin:5px 200px;"/></a>
                                   </form>
                                   </div>    
                            <div id="ou">
                                <h1 id="biblio" class="title" style="width:290px;">ou avec...</h1>
                                <img class="avec" src="css/images/face.png">
                                <img class="avec"src="css/images/open.png">
                                <img class="avec"src="css/images/google.png">
                                <img class="avec"src="css/images/yahoo.png">
                            </div>    
                        </div>
                                <!--********************************************Inscrire**************************************************************-->
                        <div id="inscrire" style="margin-left:180px;margin-top:25px;">
                                <h1 id="biblio" class="title" style="width:290px;">S'inscrire rapidement<br></h1>
                                <div id="formulaire" class="bleu" style="background-color:transparent;">
                                    <table>
                                            <tr>
                                                <td style="color:white">Courriel :</td>
                                                <td>
                                                    <input type="text" size="20" style="height:21px;border:1px solid white;">
                                                </td>
                                            </tr>
                                            <tr>
                                                <td style="color:white">Mot de passe :<br>
                                                <a href="#" style="font-size:9px;">Mot de passe oubli&eacute;</a></td>
                                                <td>
                                                    <input type="text" size="20" style="height:21px;border:1px solid white;">
                                                </td>
                                            </tr>
                                            <tr>
                                                <td style="color:white">Confirmer <br>le mot de passe :</td>
                                                <td>
                                                    <input type="password" size="20" style="height:21px;border:1px solid white;">
                                                </td>
                                            </tr>
                                   </table>
                                   <form>
                                    <a href="index2.php"><input type="button" value="OK" style="color:#a00e49;width:43px;height:26px;margin:5px 200px;"/></a>
                                   </form>
                            </div>
                        </div>
                    </div>
                      
                 </div>
    </div>
 
  </div>
</body>
</html>
